<template>
  <div>
    <div class="pageheader">
      <XHeader :left-options="{backText:''}" :title="xheader.title" class="XHeader"></XHeader>
    </div>
    <div class="page">
      <div class="block" style="margin-top: 12px">
        <div class="shipmentsbox">
          <div class="inputbox">
            <label class="text">物流公司</label>
            <input class="input" v-model="express_company" placeholder="请输入物流公司" type="text" @focusout="inputBlur" @focusin="inputFocus">
          </div>
          <div class="inputbox">
            <label class="text">快递单号</label>
            <input class="input" v-model="express_code" type="text" placeholder="请输入快递单号" @focusout="inputBlur" @focusin="inputFocus">
          </div>
        </div>
        <div style="margin-top: 32px">
          <button class="button" @click="onSubmit">发货</button>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  import Me from '@/dll/me'

  export default {
    name: 'mallOrderAfterSaleShipments',
    data () {
      return {
        xheader: {
          title: '发货'
        },
        after_sale_sn: '',
        express_company: '',
        express_code: '',
        extraDetail: {},
        sellerMemberId: null
      }
    },
    created () {
      this.after_sale_sn = this.$route.params.id
      this.extraDetail = this.$route.params.extraDetail
      this.sellerMemberId = this.$route.query.sellerMemberId
    },
    methods: {
      async onSubmit () {
        if (!this.express_company.trim()) {
          this.$vux.alert.show({
            title: '提示',
            content: '请填写物流公司'
          })
          return
        }
        if (!this.express_code.trim()) {
          this.$vux.alert.show({
            title: '提示',
            content: '请填写物流单号'
          })
          return
        }

        let param = {
          express_company: this.express_company,
          express_code: this.express_code
        }
        let server
        if (this.isSuNing(this.sellerMemberId)) { // 苏宁商品发货
          server = Me.mallOrderAfterSendGoodsSuNing
          param.order_item_id = this.extraDetail.order_item_id
          param.sn_id = this.extraDetail.sn_id
        } else {
          server = Me.mallOrderAfterSendGoods
          param.after_sale_sn = this.after_sale_sn
        }

        this.$vux.loading.show({
          text: '加载中'
        })
        let res = await server(param)
        this.$vux.loading.hide()
        if (res.code == 0) {
          this.$vux.alert.show({
            title: '提示',
            content: '发货信息已提交',
            onHide: () => {
              this.$router.back()
            }
          })
        } else {
          this.$vux.alert.show({
            title: '提示',
            content: res.msg
          })
        }
      }
    }
  }
</script>

<style lang="less" scoped>
  .shipmentsbox {
    background-color: #ffffff;
    padding: 12px;
  }

  .inputbox {
    display: flex;
    align-items: center;
  }

  .inputbox .text {
    margin-right: 12px;
    font-size: 12px;
    color: #351009;
    width: 80px;
  }

  .inputbox .input {
    border: 1px solid #f1edec;
    padding: 0 12px;
    box-sizing: border-box;
    display: block;
    flex: 1;
    font-size: 12px;
    color: #351009;
    height: 33px;
    line-height: 33px;
  }

  .inputbox + .inputbox {
    margin-top: 12px;
  }
</style>
